import React, { forwardRef, useState, useImperativeHandle, ChangeEvent, useRef, useEffect } from 'react';
import { Button, Modal, Input, Table, Space, Form, Pagination, Select, Radio, Image, Upload, DatePicker, UploadProps, DatePickerProps, TreeSelect, Switch } from 'antd';
import { WomanOutlined, ManOutlined, PlusOutlined, InboxOutlined, PaperClipOutlined } from '@ant-design/icons';
import SmartMap from '../../../components/smart-map';
import systemApi from '../../../api/system';
import * as XLSX from "xlsx";
import { addItemToUniquenList, commonErrorMsg, downloadAndRenameFile, getChangeEventValue, handleDownloadByName, readWorkBookData, toastShort } from '../../../utils';
import LoadingWapper from '../../../components/loading/LoadingWapper';
import { BJHSpeciesInfoType, SelectOption, SpeciesInfoType } from '../../../utils/types';
import statisticalAnalysisTools from './../../../statistical-analysis-temp/src';
import { TypeWorkBookReadResult } from '../../../types';
import type { ColumnsType } from 'antd/es/table';


interface ManagementEffectivenessEvaluationTableCell {
    key: string
    type: string  //类别
    valueDesc: string // 指标
    value: number //
    total: number
}

interface Props {

}

const ManagementEffectivenessEvaluationModal = (props: Props, ref: any) => {
    useImperativeHandle(ref, () => ({
        openModal: openModal
    }));


    const [isModalOpen, setIsModalOpen] = useState(false);
    const [submitLoading, setSubmitLoading] = useState(false);

    const openModal = () => {
        setIsModalOpen(true);
    }

    const handleConfirm = () => {

    }

    const handleCancel = () => {

    }

    const columns: ColumnsType<ManagementEffectivenessEvaluationTableCell> = [
        {
            title: '类别',
            dataIndex: 'type',
            width: 120,
            onCell: (_, index) => {
                if (index == 0) {
                    return { rowSpan: 4 };
                }
                if (index == 4) {
                    return { rowSpan: 6 };
                }
                if (index == 11) {
                    return { rowSpan: 5 };
                }
                if (
                    (index > 0 && index < 4) ||
                    (index > 4 && index < 6) ||
                    (index > 11 && index < 16)
                ) {
                    return { colSpan: 0 };
                }
            },
            align: 'center',
        },
        {
            title: '指标',
            dataIndex: 'valueDesc',
            width: 160,
            align: 'center',
        },
        {
            title: '专家评分',
            dataIndex: 'value',
            width: 120,
            align: 'center',
            render: (value: any, record: any, index: number) => {
                return (
                    <>
                        {
                            (index >= 0 && index <= 6) ||
                                (index >= 8 && index <= 10)
                                ?
                                <input
                                    className='table-inline-input'
                                    value={value}
                                    placeholder={'请输入'}
                                    onChange={(e) => onChangeTableData('actuality', index, e)}
                                />
                                :
                                <span>
                                    {
                                        value ?
                                            value
                                            :
                                            <span style={{ color: '#909399' }}>自动计算</span>
                                    }
                                </span>
                        }
                    </>
                )
            }
        },
        {
            title: '分值小计',
            dataIndex: 'plan',
            width: 120,
            align: 'center',
            render: (value: any, record: any, index: number) => {
                return (
                    <>
                        {
                            (index >= 0 && index <= 6) ||
                                (index >= 8 && index <= 10)
                                ?
                                <input
                                    className='table-inline-input'
                                    value={value}
                                    placeholder={'请输入'}
                                    onChange={(e) => onChangeTableData('plan', index, e)}
                                />
                                :
                                <span>
                                    {
                                        value ?
                                            value
                                            :
                                            <span style={{ color: '#909399' }}>自动计算</span>
                                    }
                                </span>
                        }
                    </>
                )
            }
        },  

    ];


    const [tableData, setTableData] = useState<ManagementEffectivenessEvaluationTableCell[]>([
        {
            key: '1',
            type: "管理基础(0～16分)",
            valueDesc: '土地权属(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '2',
            type: "",
            valueDesc: '范围界限(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '3',
            type: "",
            valueDesc: '功能区划(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '4',
            type: "",
            valueDesc: '保护对象信息(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '5',
            type: "管理措施(0～34分)",
            valueDesc: '规划编制与实施(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '6',
            type: "",
            valueDesc: '资源调查(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '7',
            type: "",
            valueDesc: '动态监测(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '8',
            type: "",
            valueDesc: '日常管护(0～7分)',
            value: 2,
            total: null,
        },
        {
            key: '9',
            type: "",
            valueDesc: '巡护执法(0～7分)',
            value: 2,
            total: null,
        },
        {
            key: '10',
            type: "",
            valueDesc: '科研能力(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '111',
            type: "",
            valueDesc: '宣传教育(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '12',
            type: "管理保障(0～30分)",
            valueDesc: '管理工作制度(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '13',
            type: "",
            valueDesc: '机构设置与人员配置(0～5分)',
            value: 2,
            total: null,
        },
        {
            key: '14',
            type: "",
            valueDesc: '专业技术能力(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '15',
            type: "",
            valueDesc: '专门执法机构(0～5分)',
            value: 2,
            total: null,
        },
        {
            key: '16',
            type: "",
            valueDesc: '资金(0～5分)',
            value: 2,
            total: null,
        },
        {
            key: '17',
            type: "",
            valueDesc: '管护设施(0～7分)',
            value: 2,
            total: null,
        },
        {
            key: '18',
            type: "管理成效(0～20)",
            valueDesc: '保护对象变化(0～16分)',
            value: 2,
            total: null,
        },
        {
            key: '19',
            type: "",
            valueDesc: '社区参与(0～4分)',
            value: 2,
            total: null,
        },
        {
            key: '20',
            type: "负面影响(-10～0分)",
            valueDesc: '开发建设活动影响(-10～0分)',
            value: 2,
            total: null,
        },
        {
            key: '21',
            type: "合计",
            valueDesc: '评分等级：',
            value: 2,
            total: null,
        },
    ]);


    const onChangeTableData = (type: string, rowIndex, e: ChangeEvent<HTMLInputElement>) => {
        const newValue = getChangeEventValue(e)
        let _tableData = tableData;
        let rowData: ManagementEffectivenessEvaluationTableCell = _tableData[rowIndex];
        // rowData[type] = newValue;
        // if (rowData.actuality && rowData.plan) {
        //     rowData.benefit = (Number(rowData.plan) - Number(rowData.actuality)).toString();
        // }
        // let totalActuality1 = 0;  //小记1
        // let totalActuality2 = 0;  //小记2
        // let totalPlan1 = 0;  //小记1
        // let totalPlan2 = 0;  //小记2
        // _tableData.forEach((rowData, rowIndex) => {
        //     if (rowIndex < 7) {
        //         totalPlan1 = totalPlan1 + Number(rowData.plan);
        //         totalActuality1 = totalActuality1 + Number(rowData.actuality);
        //     }
        //     if (rowIndex > 7 && rowIndex < 11) {
        //         totalPlan2 = totalPlan2 + Number(rowData.plan);
        //         totalActuality2 = totalActuality2 + Number(rowData.actuality);
        //     }
        //     if (rowIndex === 7) {
        //         rowData.plan = totalPlan1 + '';
        //         rowData.actuality = totalActuality1 + '';
        //         rowData.benefit = (Number(rowData.plan) - Number(rowData.actuality)).toString();
        //     }
        //     if (rowIndex === 11) {
        //         rowData.plan = totalPlan2 + '';
        //         rowData.actuality = totalActuality2 + '';
        //         rowData.benefit = (Number(rowData.plan) - Number(rowData.actuality)).toString();
        //     }
        //     if (rowIndex === 12) {
        //         rowData.plan = (Number(totalPlan1) + Number(totalPlan2)).toString()
        //         rowData.actuality = (Number(totalActuality1) + Number(totalActuality2)).toString();
        //         rowData.benefit = (Number(rowData.plan) - Number(rowData.actuality)).toString();
        //     }
        // })
        setTableData([..._tableData])
    }

    return (
        <Modal
            title={"管理成效评价"}
            open={isModalOpen}
            onOk={handleConfirm}
            onCancel={handleCancel}
            okText={'确 认'}
            cancelText={'取 消'}
            width={'800px'}
            maskClosable={false}
            confirmLoading={submitLoading}
            centered
        >
            <div className='word-editor-plugins-content benefit-evaluation-content'>
                <Table
                    className='benefit-container-table'
                    columns={columns}
                    dataSource={tableData}
                    pagination={false}
                    size={'small'}
                    bordered
                />
            </div>
        </Modal>
    )
}


export default forwardRef(ManagementEffectivenessEvaluationModal);